<html>
<head>
    <meta charset="utf-8" />
    <meta
            name="viewport"
            content="initial-scale=1,maximum-scale=1,user-scalable=no"
    />
    <!--
  ArcGIS API for JavaScript, https://js.arcgis.com
  For more information about the layers-kml sample, read the original sample description at developers.arcgis.com.
  https://developers.arcgis.com/javascript/latest/sample-code/layers-kml/index.html
  -->
    <title>KMLLayer | Sample | ArcGIS API for JavaScript 4.16</title>

    <style>
        html,
        body,
        #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>

    <link
            rel="stylesheet"
            href="https://js.arcgis.com/4.16/esri/themes/light/main.css"
    />
    <script src="https://js.arcgis.com/4.16/"></script>

    <script>
        require([
            "esri/Map",
            "esri/views/MapView",
            "esri/layers/KMLLayer",
            "esri/widgets/ScaleBar"
        ], function (Map, MapView, KMLLayer, ScaleBar) {
            try {
                var layer = new KMLLayer({
                    // major earthquakes for latest 30 days from USGS
                    // url: "https://earthquake.usgs.gov/fdsnws/event/1/query?format=kml&minmagnitude=5.8"
                    url:"http://192.1.2.225:8088/layers/query.kml"
                  //  url: "http://quickmap.dot.ca.gov/data/lcs.kml"
                });
            }
            catch (e) {
                alert(e);
            }

            var map = new Map({
                basemap: "dark-gray-vector",
                layers: [layer]
            });

            var view = new MapView({
                container: "viewDiv",
                map: map
            });

            var scalebar = new ScaleBar({
                view: view
            });
            view.ui.add(scalebar, "bottom-left");
        });
    </script>
</head>

<body>
<div id="viewDiv"></div>
</body>
</html>
